
<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
    <link href="assets/bootstrap-3.3.7-dist/css/bootstrap.min.css" rel="stylesheet">
    <link href="assets/css/right.css" rel="stylesheet">
    <script src="assets/jquery-3.5.1.min.js"></script>
    <script src="assets/bootstrap-3.3.7-dist/js/bootstrap.min.js"></script>
    <script src="assets/vue.min-v2.5.16.js"></script>
    <script src="assets/vue-router.min-2.7.0.js"></script>
    <script src="assets/axios.min.js"></script>
    <script src="assets/date_picker.js"></script>
</head>
<body>
<div id="app" class="container">
    <div class="row">
        <div class="col-md-8 col-md-offset-2">
            <div class="row">
                <div class="col-md-12" style="text-align: center; font-weight: bold; font-size: 18px; height: 80px; line-height: 80px;">
                    {{title}}
                </div>
            </div>
            <div class="row">
                <div class="col-md-6 col-md-offset-3" style="height: 80px;">
                    <label>投诉类型：</label>
                    <select v-model="complaints.comId"  class="form-control">
                        <option v-for="c in nameList" :value="c.comId">{{c.name}}</option>
                    </select>
                </div>
            </div>
            <div class="row">
                <div class="col-md-6 col-md-offset-3" style="height: 80px;">
                    <label>投诉内容</label>
                    <input type="text" class="form-control" v-model="complaints.remarks">
                </div>
            </div>
            <div class="row">
                <div class="col-md-6 col-md-offset-3" style="height: 80px;">
                    <label>投诉人：</label>
                    <select v-model="complaints.ownerId"  class="form-control">
                        <option v-for="c in ownerList" :value="c.ownerId">{{c.userName}}</option>
                    </select>
                </div>
            </div>
            <div class="row">
                <div class="col-md-6 col-md-offset-3" style="height: 80px;">
                    <label>投诉时间</label>
                    <input type="datetime-local" class="form-control"  v-model="complaints.comDate">
                </div>
            </div>
            <div class="row">
                <div class="col-md-6 col-md-offset-3" style="height: 80px;">
                    <label>处理状态：</label>
                    <select v-model="complaints.status"  class="form-control">
                        <option value="0">未处理</option>
                        <option value="1">已处理</option>
                    </select>
                </div>
            </div>
            <div class="row">
                <div class="col-md-6 col-md-offset-3" style="height: 80px;">
                    <label>处理人</label>
                    <input type="text" class="form-control" v-model="complaints.clr">
                </div>
            </div>
            <div class="row">
                <div class="col-md-6 col-md-offset-3" style="height: 80px;">
                    <button class="btn btn-primary" @click="doSave">保存</button>
                    <button class="btn btn-default" @click="doBack">取消</button>
                </div>
            </div>
        </div>
    </div>
</div>
<script>
    new Vue({
        el: '#app',
        data: {
            complaintId: null,
            nameList:null,
            title: null,
            complaints:{
                id:null,
                comId: null,
                comDate: null,
                ownerId: null,
                status: null,
                clr: null,
                remarks: null,
            },
            complaintList:null,
            ownerList:null

        },
        methods: {
            doSave(){
                var uid = localStorage.getItem("uid");
                if (this.complaintId == null){ //添加
                    console.log(this.complaints);
                    axios.post("http://localhost:8080/complaint/add?uid="+uid,
                       this.complaints
                    ).then(response =>{
                        if (response.data.code == 200){
                            window.parent.main_right.location.href="complaint_list.html";
                        }else{
                            alert(response.data.msg)
                        }
                    })
                }else{ //修改
                    console.log(this.complaints);
                    axios.post("http://localhost:8080/complaint/update?uid="+uid,
                        this.complaints,
                    ).then(resq =>{
                        if (resq.data.code==200){
                            window.parent.main_right.location.href="complaint_list.html";
                        } else {
                            alert("修改失败")
                        }
                    })
                }

            },

            doBack(){
                history.go(-1);
            },
            doName(){
                var uid = localStorage.getItem("uid");
                axios.get("http://localhost:8080/complaint/name?uid="+uid).then(response =>{
                    this.nameList = response.data.data;
                    console.log(response.data.data)
                })
            }
        },
        created: function () {
            var uid = localStorage.getItem("uid");
           // this.requestBuildingList(); //调用楼栋列表函数
            var url = window.location.href;
            if (url.indexOf("id") != -1){
                this.complaintId = url.substring(url.indexOf("=")+1);
            }
            console.log("页码跳转的id:"+this.complaintId);
            if (this.complaintId == null){ //添加
                this.title = "添加投诉信息"
                axios.get("http://localhost:8080/complaint/list?pageIndex=1&pageSize=100&uid="+uid).then(response =>{
                    //console.log(response.data);
                    this.complaintList = response.data.data;
                        });
                axios.get("http://localhost:8080/complaint/owner?uid="+uid).then(resp =>{
                    this.ownerList=resp.data.data;

                })
                this.doName();
            }else{
                this.title = "修改投诉信息"
                axios.get("http://localhost:8080/complaint/info?id="+this.complaintId+'&uid='+uid).then(resq =>{
                    console.log(resq.data.data)
                       this.complaints=resq.data.data;
                    axios.get("http://localhost:8080/complaint/list?pageIndex=1&pageSize=100&uid="+uid).then(response =>{
                        //console.log(response.data);
                        this.complaintList = response.data.data;
                    });
                    axios.get("http://localhost:8080/complaint/owner?uid="+uid).then(resp =>{
                        this.ownerList=resp.data.data;

                    })
                    this.doName();
                });
            }
            }


    });
</script>
</body>
</html>